<!DOCTYPE html>
<html class="no-js" lang="zh_CN">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1, maximum-scale=1">

    <title>${system_admin_title}</title>
    #required_css
</head>

<body>
<div class="app $layout">
    <!-- 头部菜单 -->
    #header
    <section class="layout">
        <!-- 菜单 -->
        #sidebar
        <section class="container">
            <!-- 内容主体 -->
            <section class="main-content">
                <!-- 主体操作栏 -->
                <header class="header navbar">
                    <!-- 左按钮区 -->
                    <div class="toolbar">
                        <button class="btn btn-primary toolbar-item" id="btnAdd${className}"><i class="fa fa-plus"></i> 新增</button>
                    </div>
                    <div class="pull-right toolbar">
                    </div>
                </header>
                <div class="content-wrap">
                    <div class="wrapper">
                        <div class="row">
                            <div class="col-lg-12 col-md-12">
                                <table id="dg${className}"></table>
                                <div id="dg${className}Pager"></div>
                            </div>
                        </div>
                    </div>
                </div>
                <a class="exit-offscreen"></a>
            </section>
        </section>
    </section>
</div>
#required_js
<script type="text/javascript">
    ns.requireJS([
        "/framework/js/form/checkbox.js",
        "/framework/js/view/datagrid.js"]);
    ns.ready(function(){
        var dg${className} = $("#dg${className}").jqGrid({
            url: '${action}/data',
            colModel: [
                #foreach($!column in $!columns.entrySet())
                #set($v = $!column.value)
                #if($v.get("fieldName")=="id")
                { label: "ID", name: "id", key: true, hidden:true },
                #else
                { label: "${v.get('displayName')}", name: "${v.get('fieldName')}"},
                #end
                #end
                { label:'操作',formatter:function(val,node,data){
                    return ns.view.datagrid.renderOp([
                        {title: "查看详情", onclick: function () {
                            ns.view.showModal("${action}/detail/" + data.id);
                        }},
                        {title:"编辑", onclick:function(){
                            doEdit${className}(data.id);
                        }},
                        {title:"删除", onclick:function(){
                            doDelete${className}(data.id);
                        }}
                    ]);
                } }
            ],
            rownumbers:true,
            height: $(".main-content .wrapper").height() - ns.view.datagrid.offsetHeight,
            pager: "#dg${className}Pager",
            multiselect : true,
            multiboxonly : true,
            icheckbox : true
        });

        //新增
        $("#btnAdd${className}").on("click", function(){
            ns.view.showModal("${action}/add",{
                onHidden : function(dialog, obj){
                    if(dialog.ok){
                        dg${className}.reload();
                    }
                }
            });
        });

        //修改
        function doEdit${className}(id){
            ns.view.showModal("${action}/edit/"+id,{
                onHidden : function(dialog, obj){
                    if(dialog.ok){
                        dg${className}.reload();
                    }
                }
            });
        }
        //删除
        function doDelete${className}(id){
            ns.tip.confirm("确定要删除此条数据吗？", function(){
                var bar = ns.view.showProgressbar("正在删除...");
                ns.get("${action}/delete/"+id,function(success, data){
                    if(success){
                        ns.tip.toast.success("数据已删除");
                        dg${className}.reload();
                    } else{
                        ns.tip.toast.error(data.message);
                    }

                    bar.close();
                });
            });
        }
    });
</script>
</body>
</html>